<template>
	<uni-shadow-root>
		<view class="live-wrap">
			<view class="live-cont">
				<view class="cover-cont">
					<image src="/static/images/publish/commit-live.png" />
					<view class="margin-top-sm flex flex-direction align-center" style="line-height: 1.4;" v-if="isSuccess">
						<view><text>直播申请已经提交</text></view>
						<view><text>请耐心等待管理审核</text></view>
					</view>
					<view class="margin-top-sm flex flex-direction align-center" style="line-height: 1.4;" v-else>
						<view><text>直播申请未通过</text></view>
					</view>
				</view>
			</view>
			<view class="btn-wrap margin-top-sm">
				<button class="cu-btn round bg-red" @click="handleCancel" v-if="isSuccess">撤销申请</button>
				<button class="cu-btn round bg-red" @click="goback" v-else>返回</button>
			</view>
		</view>
	</uni-shadow-root>
</template>

<script>
	import {mapMutations} from "vuex"
	export default {
		data() {
			return {
				timer:null,
				isSuccess:true,//是否通过申请
			}
		},
		methods: {
			async handleCancel() {
				let {code}=await this.$h.api.liveModel.postCancelReview()
				if(code===1){
					this.$h.toast('撤销成功', true).then(() => {
						this.$emit("change", 0)
					})
				}else{
					this.$h.toast('撤销失败')
				}
			},
			async getPusherInfo(){
				let {code,msg,data} = await this.$h.api.liveModel.getLive()
				// console.log(code,msg,data)
				if(data.status===2){
					this.SET_LIVEPUSHER(data.data)
					this.$emit("change",2)
				}else if(data.status===3){
					this.isSuccess=false
					// this.$h.toast(data.msg)
				}else{
					this.isSuccess=true
				}
			},
			goback(){
				this.$h.router.back()
			},
			...mapMutations('live',['SET_LIVEPUSHER'])
		},
		async created() {
			this.getPusherInfo()
			this.timer=setInterval(()=>{
				this.getPusherInfo()
			},1000)
		},
		beforeDestroy(){
			clearInterval(this.timer)
		}
	}
</script>

<style lang="scss" scoped>
	.live-wrap {
		width: 100%;
		height: 1040rpx;
		display: flex;
		flex-direction: column;

		.live-cont {
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: center;

			.cover-cont {
				display: flex;
				flex-direction: column;
				align-items: center;

				image {
					width: 100rpx;
					height: 100rpx;
				}
			}
		}

		.btn-wrap {
			height: 80rpx;

			button {
				color: #fff;
				width: 100%;
				height: 80rpx;
				box-sizing: border-box;
				line-height: 80rpx;
				font-size: 28rpx;
				font-weight: 500;
			}
		}
	}
</style>
